<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=no"/>
    <meta name = "format-detection" content="telephone = no" />
    <link rel="shortcut icon" href="img/smlogo.png" type="image/x-icon">
    <title></title>
    <link rel="stylesheet" href="css/swiper.min.css">
    <link rel="stylesheet" href="css/swiper_change.css"/>
    <link rel="stylesheet" href="css/highexp.css"/>
    <style>
        *{
            margin:0;
            padding:0;
        }
        html {
            font-size: 16px;
        }
        html {
            font-family: PingFang-SC-Regular,Helvetica,sans-serif;
            /*font-size: 1rem/1;*/
            font-size: 1rem;
            color: #333;
        }
        body {
            background: #f2f2f2;
            width: 100%;
            max-width: 1000px;
            margin: 0 auto;
        }
        a {  text-decoration: none;  }
        h1{font-weight: normal}
        .fl{    float:left;  }
        .fr {  float: right;  }
        #box,#friendlist{
            max-width: 1000px;
            min-width: 320px;
            margin: 0 auto;
        }
        #friendlist{
            /*left:50%;*/
            /*transform: translateX(-50%);*/
            left:inherit;
        }
        .container {  padding: 0;  }
        /*header*/
        .module-topbar {
            height: 44px;
            color: #333;
            text-align: center;
            position: fixed;
            top: 0;
            width: 100%;
            z-index: 19;
            -wekbit-box-shadow: 0 1px 2px #cfcfcf;
            box-shadow: 0 1px 2px #cfcfcf;
            background: #f9f9f9;
            max-width: 1000px;
            min-width:320px;
            /*left:50%;*/
            /*transform: translateX(-50%);*/
        }
        .module-topbar .txt-link {
            padding: 0 10px;
            font-size: 1.0625rem;
            line-height: 44px;
            color: #FF8200;
        }
        .txt-cut {
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }
        .module-topbar .title-group .title {
            font-size: 1.0625rem;
            line-height: 28px;
            color: #333;
        }
        .module-topbar .title-group .title:only-child {
            font-size: 1.125rem;
            line-height: 44px;
        }
        /*主页面*/
        .module-publisher {
            position: absolute;
            background-color: #fafafa;
            height: 100%;
            width: 100%;
            max-width: 1000px;
            min-width: 320px;
            /*left: 50%;*/
            /*transform: translateX(-50%);*/
        }
        .module-publisher .txt-publisher-wrapper {
            background-color: #fff;
            padding: 5px 0 0 0;
        }
        .module-publisher .J-textarea {
            padding: 8px 14px 0 14px;
            width: 100%;
            height: 120px;
            font-size: 16px;
            resize: vertical;
            border: none;
            background-color: #fff;
            -webkit-tap-highlight-color: transparent;
            -webkit-box-sizing: border-box;
            -moz-box-sizing: border-box;
            box-sizing: border-box;
        }
        .wrapper-info-publisher {
            display:none;
            border: none;
            background-image: -webkit-gradient(linear,left top,left bottom,color-stop(50%,#dadada),color-stop(50%,#dadada),color-stop(100%,#fff));
            background-image: -webkit-linear-gradient(top,#dadada 50%,#dadada 50%,#fff 100%);
            /*background-image: inear-gradient(to bottom,#dadada 50%,#dadada 50%,#fff 100%);*/
            background-size: 100% 1px;
            background-repeat: no-repeat;
            background-position: bottom;
        }

        .module-publisher .wrapper-info-publisher {
            padding-bottom: 2px;
            border-bottom: 1px solid #fff;
        }
        /*提听谁看部分*/
        .module-publisher .info-publisher {
            font-size: 16px;
            position: relative;
            background-color: #fff;
            color: #577b9e;
            padding: 0 15px 0 8px;
        }
        .selfclear {
            zoom: 1;
        }
        .module-publisher .wrapper-send-publisher {
            padding: 5px 8px 7px 8px;
            overflow: hidden;
            background-color: #fff;
        }
        .module-publisher .textoverflow {
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }
        /*召唤表情区*/
        .module-publisher .action-publisher {
            background-color: #f9f9f9;
            overflow: hidden;
            font-size: 22px;
            text-align: center;
            position: relative;
            height: 43px;
            z-index: 1;
        }
        .action-publisher.layout-box.line-bottom{
            border: 1px solid #F2F2F2;
        }
        .layout-box {
            display: -webkit-box;
            display: -webkit-flex;
            display: -ms-flexbox;
            display: flex;
        }
        .module-publisher .action-publisher .toolbaricon {
            margin: 0 10px 0 10px;
            width:31px;
        }
        .iconf {
            font-family: wb440;
            color: #444;
            -webkit-font-smoothing: antialiased;
            -moz-osx-font-smoothing: grayscale;
        }
        .module-publisher .action-publisher span, .module-publisher .action-publisher a {
            color: #888;
        }
        .module-publisher .action-publisher .iconf {
             -webkit-tap-highlight-color: transparent;
             padding: 10px;
         }
        /*.iconf_compose_mention::before {*/
            /*width:22px;*/
            /*content: "";*/
            /*background: url(../img/sz.png) no-repeat;*/
            /*background-size: 28px;*/
        /*}*/
        /*.iconf_compose_emoticon::before {*/
            /*width:22px;*/
            /*content: "\3b0";*/
        /*}*/
        .card-combine .line-around:not(.card9), .line-separate::after {
            border-bottom: 1px solid #dadada;
        }
        .line-bottom{
            border: none;
            background-image: -webkit-gradient(linear,left top,left bottom,color-stop(50%,transparent),color-stop(50%,transparent),color-stop(100%,#dadada));
            background-image: -webkit-linear-gradient(top,transparent 50%,#dadada 50%,#dadada 100%);
            background-image: linear-gradient(to bottom,transparent 50%,#dadada 50%,#dadada 100%);
            background-size: 100% 1px;
            background-repeat: no-repeat;
            background-position: bottom;
        }
        /*图标*/
        #callfriend{
            cursor: pointer;
            background: url("img/aite5.png") no-repeat center;
            background-size: 28px;
        }
        #facebtn{
            cursor: pointer;
            background: url(img/sfaceimg1.png) no-repeat center;
            background-size: 28px;
        }
        #callnamediv{
            height:31px;
            line-height:31px;
            white-space:nowrap;
            text-overflow:ellipsis;
            -o-text-overflow:ellipsis;
            overflow: hidden;
        }
        /*好友列表*/
        .wrapper-popup {
            z-index: 201;
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            max-width:1000px
            height: 100%;
            background-color: #f2f2f2;
        }
        .wrapper-popup .list-pos-pop {
            padding: 0 0 1px;
            background-color: #fff;
        }
        .wrapper-popup .sub-header {
            height: 44px;
            color: #333;
            text-align: center;
            -wekbit-box-shadow: 0 1px 2px #cfcfcf;
            box-shadow: 0 1px 2px #cfcfcf;
            background: #f9f9f9;

            position:fixed;
            top:0;
            width:100%;
            max-width:1000px;
            z-index: 100;
        }
        #J-poisearch{margin-top:44px;}
        .wrapper-popup .search-pos-pop .j_searchButton {
            width: 66px;
            text-indent: 6px;
            line-height: 33px;
            font-size: 1.0625rem;
            color: #ff8200;
            text-align: center;
            text-shadow: 0 1px 0 #fff;
        }
        .wrapper-popup .sub-header .BtnLev4 {
            padding: 0 10px;
            font-size: 1.0625rem;
            line-height: 44px;
            color: #ff8200;
        }
        .wrapper-popup .sub-header span {
            font-size: 1.25rem;
            line-height: 40px;
            display: inline-block;
            max-width: 70%;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
            margin-left:-50px;
        }
        .wrapper-popup .search-pos-pop {
            position: relative;
            padding: 7px 6px 7px 7px;
            width: 100%;
            background: #dedede;
            outline: 0;
            box-sizing: border-box;
            box-shadow: none;
        }
        .wrapper-popup .search-pos-pop .txt-pos-pop {
            overflow: hidden;
            border: silver solid 1px;
            background: #fff;
            border-radius: 3px;
            box-shadow: inset 0 1px 2px rgba(171,171,171,.6);
        }
        .wrapper-popup .search-pos-pop .clear {
            position: relative;
            margin: 7px 10px;
            width: 15px;
            height: 15px;
            background: #bdbdbd;
            border-radius: 7px;
        }
        .wrapper-popup .search-pos-pop .type {
            position: relative;
            margin: 5px 0 0 6px;
            width: 20px;
            height: 20px;
            font-size: 20px;
            color: #828282;
            background: url(img/icon_4_n.png)no-repeat center;
            background-size: 20px;
        }
        .wrapper-popup .search-pos-pop .input-box {
            overflow: hidden;
        }
        .wrapper-popup .search-pos-pop .search {
            margin: 0;
            border: none;
            padding: 7px 0;
            width: 100%;
            font-size: .875rem;
            background: 0 0;
            vertical-align: top;
            box-sizing: border-box;
        }
        .wrapper-popup .list-pos-pop .line-around {
            box-shadow: none;
        }
        .wrapper-popup .list-pos-pop .card {
            margin-bottom: 0;
            border-bottom:1px solid #e7e7e7;
            cursor: pointer;
        }
        .layout-box {
            display: -webkit-box;
            display: -webkit-flex;
            display: -ms-flexbox;
            display: flex;
        }
        .mod-media:first-child {
            margin-left: .75rem;
        }
        .mod-media {
            position: relative;
            display: block;
            text-align: center;
            margin: .625rem 0 .625rem .5rem;
        }
        .txt-m {
            font-size: .875rem;
        }
        .layout-box .box-col {
            -webkit-box-flex: 1;
            -webkit-flex: 1;
            -ms-flex: 1;
            flex: 1;
            width: 100%;
        }
        .media-graphic .item-list {
            padding: .5rem .6875rem;
            display: -webkit-box;
            display: -webkit-flex;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-direction: normal;
            -webkit-box-orient: vertical;
            -webkit-flex-direction: column;
            -ms-flex-direction: column;
            flex-direction: column;
            -webkit-box-pack: center;
            -ms-flex-pack: center;
            -webkit-justify-content: center;
            justify-content: center;
            overflow: hidden;
        }
        .media-graphic .item-main {
            line-height: 1.125rem;
            overflow: hidden;
        }
        /*等待提醒*/
        #sendwait{
            display:none;
            width:100%;
            position: fixed;
            top:0;
            left:0;
            bottom:0;
            z-index: 9999;
            background:rgba(0,0,0,0.75);
        }
        #sendwait>div{
            height:100%;
            width:100%;
            position: relative;
        }
        #sendwait>div>div{
            width:80px;
            height:80px;
            line-height: 80px;
            text-align: center;
            position: absolute;
            top:50%;
            left:50%;
            transform: translate(-50%,-50%);
            background: rgba(53,53,53,0.5);
        }
        #sendwait>div>div>img{
            width: 44px;
            height: 44px;
            vertical-align: middle;
            -webkit-animation: circle 1s infinite linear;
        }
        @-webkit-keyframes circle{
            0%{ transform:rotate(0deg); }
            100%{ transform:rotate(-360deg); }
        }
        /*转发成功*/
        .myscore{
            padding-bottom:20px;
            font-size: 20px;
            color: #303030;
        }
    </style>
</head>
<body style="padding-top:45px; overflow-x:hidden;">
    <!--主页面-->
    <div id="box" class="container stage-publisher">
        <header class="module-topbar">
            <a class="fl txt-link" href="javascript:history.go(-1);" data-node="back" title="取消" data-act-type="hover">取消</a>
            <a class="fr txt-link" href="javascript:;" id="sendbtn">发送</a>
            <div class="title-group">
                <h1 class="title txt-cut">转发</h1>
            </div>
        </header>
        <article class="module-publisher">
            <div class="txt-publisher-wrapper">
                <textarea style="resize:none" id="contentword" name="content" class="J-textarea txt-publisher" placeholder="这一刻的想法..."></textarea>
            </div>
            <div class="wrapper-info-publisher">
                <div class="info-publisher selfclear">
                    <div id="callnamediv"></div>
                </div>
            </div>
            <section class="action-publisher layout-box line-bottom">
                <div class="toolbaricon" id="callfriend" style="display:none;">
                    <!--好友按钮-->
                </div>
                <div class="toolbaricon" id="facebtn">
                    <!--表情按钮-->
                </div>
            </section>
            <!--表情区域-->
            <div class="swiper-container" style="display:none;">
                <div class="swiper-wrapper">

                    <div class="swiper-slide"  id="zerofacepage">

                    </div>

                    <div class="swiper-slide" id="onefacepage">

                    </div>

                    <div class="swiper-slide" id="twofacepage">

                    </div>
                </div>
                <div class="swiper-pagination swiper-pagination-clickable swiper-pagination-bullets">
                    <span class="swiper-pagination-bullet swiper-pagination-bullet-active"></span>
                    <span class="swiper-pagination-bullet"></span>
                    <span class="swiper-pagination-bullet"></span>
                </div>
            </div>
        </article>
    </div>
    <!-- 好友列表-->
    <div id="friendlist" class="wrapper-popup" style="display:none;">
        <div id="J-actualct" style="min-height: 736px;">
            <header class="sub-header">
                <a class="J-cancel fl BtnLev4" href="javascript:;" id="closefriend">关闭</a>
                <span>联系人</span>
            </header>
            <div id="J-poisearch" class="search-pos-pop">
                <a class="j_searchButton fr hid" id="cancelsearch" href="javascript:;" style="display: none;">取消</a>
                <div class="txt-pos-pop" style="margin-right: 0px;">
                    <span class="j_clearKey fr clear hid" node-type="clear" style="display: none;"></span>
                    <span class="fl type iconf iconf_navbar_search" node-type="type-list"></span>
                    <div class="input-box">
                        <input class=" j_searchInput search" id="searchfriendinput" type="text" node-type="search" placeholder="搜索联系人">
                    </div>
                </div>
            </div>
            <div id="J-result" style="display: none;">
                <div class="list-pos-pop" id="searchfriendlist"></div>
            </div>
            <div id="J-default" style="display: block;">
                <div class="list-pos-pop" data-node-type="userList" id="showfriendlist">
                    <span class="loading" style="display: none;"></span>
                </div>
            </div>
        </div>
    </div>
    <!-- 发送等待-->
    <div id="sendwait">
        <div>
            <div>
                <img src="img/aoy.png"/>
            </div>
        </div>
    </div>
    <!--转发成功-->
    <div id="heightexpdiv">
        <div>
            <div class="heightexpform">
                <div>
                    <div class="myscore">转发成功</div>
                    <div class="btndiv">
                        <div id="heightexpok" class="fr">确定</div>
                    </div>
                </div>
            </div>
        </div>
    </div>
<script src="js/jquery-1.11.3.js"></script>
<script src="js/jquery.cookie.js"></script>
<script src="ftnjs/swiper.jquery.min.js"></script>
<script src="ftnjs/urlnote.js"></script>
<script src="ftnjs/sendfaceftn.js"></script>
<script src="js/sendsharepage.js"></script>
</body>
</html>